<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<script type="text/javascript">
	$(function() {
		$.getJSON('http://www.highcharts.com/samples/data/jsonp.php?filename=range.json&callback=?', function(data) {

			$('#container').highcharts({

				chart : {
					type : 'arearange',
					zoomType : 'x'
				},

				title : {
					text : 'Temperature variation by day'
				},

				xAxis : {
					type : 'datetime'
				},

				yAxis : {
					title : {
						text : null
					}
				},

				tooltip : {
					crosshairs : true,
					shared : true,
					valueSuffix : '°C'
				},

				legend : {
					enabled : false
				},

				series : [ {
					name : 'Temperatures',
					data : data
				} ]

			});
		});

	});
</script>

<div id="container" style="min-width: 400px; height: 400px; margin: 0 auto"></div>

